<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>管理员登录</title>
    <script src="https://cdn.tailwindcss.com/3.4.16"></script>
</head>
<body class="bg-gray-100 min-h-screen flex items-center justify-center">
<div class="w-full max-w-md">
    <!-- 登录卡片 -->
    <div class="bg-white shadow-xl rounded-lg p-8">
        <!-- 标题 -->
        <div class="text-center mb-8">
            <h1 class="text-3xl font-bold text-indigo-700 mb-2">📚 书籍在线投票系统</h1>
            <h2 class="text-xl text-gray-600">管理员登录</h2>
        </div>

        <!-- 错误提示 -->
        <c:if test="${not empty error}">
            <div class="mb-6 p-3 bg-red-100 border-l-4 border-red-500 text-red-700 rounded">
                    ${error}
            </div>
        </c:if>

        <!-- 登录表单 -->
        <form action="login" method="post" class="space-y-6">
            <div>
                <label for="username" class="block text-sm font-medium text-gray-700 mb-1">用户名</label>
                <input
                        type="text"
                        id="username"
                        name="username"
                        required
                        class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 transition"
                        placeholder="请输入管理员用户名"
                >
            </div>

            <div>
                <label for="password" class="block text-sm font-medium text-gray-700 mb-1">密码</label>
                <input
                        type="password"
                        id="password"
                        name="password"
                        required
                        class="w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500 transition"
                        placeholder="请输入密码"
                >
            </div>

            <div>
                <button
                        type="submit"
                        class="w-full py-2 px-4 bg-indigo-600 hover:bg-indigo-700 text-white font-medium rounded-md transition flex items-center justify-center gap-2"
                >
                    <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
                        <path fill-rule="evenodd" d="M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z" clip-rule="evenodd" />
                    </svg>
                    登录
                </button>
            </div>
        </form>

        <!-- 返回链接 -->
        <div class="mt-6 text-center">
            <a href="index" class="text-sm text-indigo-600 hover:text-indigo-800 hover:underline">返回首页</a>
        </div>
    </div>
</div>
</body>
</html>